const doctorButton = document.getElementById("doctorButton");
const patientButton = document.getElementById("patientButton");
let dq = 0;

if (navigator.mediaDevices.getUserMedia) {
    let audioChunks = []

    // 约束属性
    const constraints = {
        // 音频约束
        audio: {
            sampleRate: 48000, // 采样率
            sampleSize: 16, // 每个采样点大小的位数
            channelCount: 1, // 通道数
            volume: 1, // 从 0（静音）到 1（最大音量）取值，被用作每个样本值的乘数
            echoCancellation: true, // 开启回音消除
            noiseSuppression: true, // 开启降噪功能
        },
        // 视频约束
        video: false
    }
    // 请求获取音频流
    navigator.mediaDevices.getUserMedia({ audio: true }) //constraints
        .catch(err => serverLog("ERROR mediaDevices.getUserMedia: ${err}"))
        .then(stream => {// 在此处理音频流
                // 创建 MediaRecorder 实例
                const mediaRecorder = new MediaRecorder(stream);

                // 点击按钮
                doctorButton.onclick = () => {
                    if(dq===0)
                    {
                        mediaRecorder.start();
                        text1.value="开始录音……";
                        dq = 1;
                    }
                    else if(dq===1)
                    {
                        mediaRecorder.stop();
                        dq = 2;
                        alert("医生结束说话");
                    }
                }

                patientButton.onclick = () => {
                    if(dq===0)
                    {
                        mediaRecorder.start();
                        text1.value="开始录音……";
                        dq = 3;
                    }
                    else if(dq===3)
                    {
                        mediaRecorder.stop();
                        dq = 4;
                        alert("患者结束说话");
                    }
                }

                mediaRecorder.ondataavailable = e => {
                    audioChunks.push(e.data)
                }
                // 结束事件
                mediaRecorder.onstop = e => {

                    // 将录制的数据组装成 Blob（binary large object） 对象（一个不可修改的存储二进制数据的容器）
                    const blob = new Blob(audioChunks, { type: "audio/mp3" })
                    audioChunks = []

                    var form=new FormData();
                    form.append("upfile",blob,"recorder.mp3")

                    var xhr=new XMLHttpRequest();
                    xhr.open("POST","/speech_return");
                    xhr.send(form);
                    xhr.onreadystatechange=function(){
                        if (xhr.readyState === 4) { // 请求完成
                            if (xhr.status === 200) { // 请求成功
                                var response = xhr.responseText;
                                // 将 JSON 字符串解析为 JavaScript 对象
                                var data = JSON.parse(response);
                                // 访问对象中的 success 属性
                                var successMessage = data.success;
                                // 输出结果
                                console.log("服务器返回的数据:", successMessage);
                                // text1.value = successMessage;
                                if(dq === 2)
                                {
                                    displayChatMessage('doctor', successMessage, 'static/image/医生.png');
                                }
                                else if(dq === 4)
                                {
                                    displayChatMessage('patient', successMessage, 'static/image/患者列表.png');
                                }
                                console.log(dq);
                                dq = 0;


                            } else {
                                // 处理错误
                                console.error("请求失败，状态码:", xhr.status);
                                alert("录音失败，请检查控制台以获取更多信息。");
                            }
                        }
                    }
                }
            },
            () => {
                console.error("授权失败！");
            }
        );
    } else {
        console.error("该浏览器不支持 getUserMedia！");
}

function displayChatMessage(role, message, avatar) {
    var chatContainer = document.getElementById('chatContainer');
    var messageContainer = document.createElement('div');
    var messageDiv = document.createElement('div');
    var avatarElement = document.createElement('img');

    // 设置文本框的值
    messageDiv.textContent = message;
    messageDiv.contentEditable = "true";

    // 设置头像
    avatarElement.src = avatar;
    avatarElement.alt = role + " avatar";

    // 将头像和文本框添加到消息容器中
    messageContainer.appendChild(avatarElement);
    messageContainer.appendChild(messageDiv);

    // 根据角色设置样式类
    if (role === 'doctor') {
        messageContainer.classList.add('doctor-message');
        avatarElement.classList.add('doctor-avatar');
        messageDiv.classList.add('message-textarea');
    } else if (role === 'patient') {
        messageContainer.classList.add('patient-message');
        avatarElement.classList.add('patient-avatar');
        messageDiv.classList.add('message-textarea');
    }

    // 将消息容器添加到聊天容器中
    chatContainer.appendChild(messageContainer);

    // 滚动到底部以显示最新消息
    chatContainer.scrollTop = chatContainer.scrollHeight;
}